<!DOCTYPE html>  
<html lang="en">  
<head>  
<meta charset="UTF-8">  
<meta name="viewport" content="width=device-width, initial-scale=1.0">  
<title>WebRTC Camera Access</title>  
</head>  
<body>  
  
<!-- 视频元素，用于显示来自摄像头的视频流 -->  
<video id="videoElement" autoplay playsinline></video>  
  
<script>  
// 获取视频元素  
const videoElement = document.querySelector('#videoElement');  
  
// 检查浏览器是否支持getUserMedia API  
if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {  
  // 请求摄像头权限  
  navigator.mediaDevices.getUserMedia({ video: true })  
    .then(function(stream) {  
      // 将媒体流设置为视频元素的源  
      videoElement.srcObject = stream;  
    })  
    .catch(function(err) {  
      console.log('发生错误: ' + err);  
    });  
} else {  
  console.log('浏览器不支持getUserMedia API');  
}  
</script>  
  
</body>  
</html>
